<template>
    <div class="address">
        <van-list v-model="loading" :finished="isLoadFinished" @load="getData">
            <van-radio-group class="address-list" v-model="isDefaultChecked" @input="handleChangeStatus">
                <AddressItem v-for="item in listData"
                    :key="item.id"
                    :id="item.id"
                    :title="item.deliveryPerson"
                    :tel="item.deliveryPhone"
                    :address="item.province + item.city + item.section + item.street_name + item.deliveryAddress"
                    :checkName="item.id"
                    @getData="getData"
                />
            </van-radio-group>
        </van-list>
        <van-row class="button-fixed-bottom" @click.native="$router.push({name:'addressEdit'})">
            <van-button bottom-action>
                <van-icon name="add-o" />
                <i>添加地址</i>
            </van-button>
        </van-row>
        <van-toast :mask="true" message="加载中..." type="loading" v-model="submitLoading"></van-toast>
        <back-top></back-top>
    </div>
</template>

<script>
import AddressItem from '@/components/address-item.vue'
import BackTop from '@/components/back-top'
import { getAddressList, setDefaultAddress } from '@/api/address/index.js'

export default {
    name: 'Address',
    components: {
        AddressItem,
        BackTop,
    },
    data() {
        return {
            loading: false,
            submitLoading: false,
            type: 1,
            page: 1,
            listData: [],
            total: 0,
            pageCount: 1,
            isLoadFinished: false,
            isDefaultChecked: 0,
        }
    },
    methods: {
        getData () {
            this.loading = true
            getAddressList(this.type, this.page).then((res) => {
            	
                this.loading = false
                this.listData = res.data.list;
                
                if(this.page > 1){
	                this.listData = this.listData.concat(res.data.list)
                }
                
                this.listData.forEach((val, index) => {
                    if (val.isDefault == 1) {
                        this.isDefaultChecked = val.id
                    }
                })
                
                this.total = res.data.total
                this.pageCount = res.data.pageCount
                if (this.page >= this.pageCount) {
                    this.isLoadFinished = true
                } else {
                    this.page++
                }
            }).catch((res) => {
                this.loading = false
            })
        },
        handleChangeStatus (id) {
            this.submitLoading = true
            setDefaultAddress(id).then((res) => {
               this.submitLoading = false
            }).catch(() => {
                this.submitLoading = false
            })
        },
    },
    created () {
        
    },
    activated () {
		
	},
	beforeRouteEnter (to, from, next) {
        next(vm => {
            vm.getData()
        })
    },
}
</script>

<style lang="scss">
.address {
    .address-list {
        padding-bottom: 50px;
    }
}
</style>
